/* -------------  Top Introducer Logo Section  ------------- */
body header section.heading {
              color: black;
        border-top: 1px white;
              border-bottom: 1px white;
              font-family: Arial, Tahoma, Geneva;                                    /* font for text (first choice and fallback) */
              background-color: #FFFFFF;
              }
body header section.heading h1.nav-menu-panel {
              color: black;
              font-family: Arial, Tahoma, Geneva;     
              }
body header section.heading ul.trq-menu-bar > li.trq-menuItem > a {
              color: #00677F;                                                                       /* User Name */
          /*  font-family: Arial, Tahoma, Geneva;     */
              }
.keyword-panel a i:before {
         color: #00677F;
}

/* --------------- Change Color Magnifying Glass in Header --------------- */
.keyword-panel i::before,
.keyword-panel .trq-icon-btn .glyphicons i::before,
.keyword-panel .trq-icon-btn .glyphicons span:first-child::before {
    color: #00677F;
}

/* -------------  Menu bar background  ------------- */
.sidenav-nav.expanded {
              background-color: #C8C8C8;
              border-color: #C8C8C8;
              }
.sidenav-nav {
              background-color: #C8C8C8;
              border-color: #C8C8C8;
              }
.simplebar-scroll-content {
              background-color: #C8C8C8;
              border-color: #C8C8C8;
              color: black;
              }
.sidenav-nav .sidenav-navitem:hover > .navitem .navicon > *, .sidenav-nav .sidenav-navitem:hover > .navitem .navtext > *, .sidenav-nav .sidenav-navitem.highlighted > .navitem .navicon > *, .sidenav-nav .sidenav-navitem.highlighted > .navitem .navtext > * {
              color: #00677F;
                         }
.sidenav-toggle .icon-bar {
              background-color: #00677F;                                                /* expand and collapse menu */
              }

/* -------------  Menu bar text------------- */
.sidenav-nav .sidenav-navitem > .navitem .navicon, .sidenav-nav .sidenav-navitem > .navitem .navtext, .sidenav-nav .sidenav-navitem > .navitem .navicon > *, .sidenav-nav .sidenav-navitem > .navitem .navtext > * {
              color: #000000;
              }
.sidenav.expanded .sidenav-subnav .sidenav-subnavitem > .navitem {
              color: #000000;
              }
.sidenav-nav .sidenav-navitem:hover > .navitem .navicon, .sidenav-nav .sidenav-navitem:hover > .navitem .navtext, .sidenav-nav .sidenav-navitem.highlighted > .navitem .navicon, .sidenav-nav .sidenav-navitem.highlighted > .navitem .navtext {
              color: #00677F;
              }
.sidenav-subnav .sidenav-subnavitem .navtext {
              color: #000000;
              }


/* -------------  content page title  ------------- */
.trq-page-title {
             color: black;
             font-family: Arial, Tahoma, Geneva;   
              }


/* -------------  Collapse Headers color  ------------- */
#content .rc-collapse > .rc-collapse-item > .rc-collapse-header, #content .non-collapsible-panel > .panel-heading {
              background-color: #C8C8C8;
              /* color: white; */
              color: #000000;
             border-color: #C8C8C8;
             font-family: Arial, Tahoma, Geneva;                      /* font for text */
              font-weight: lighter;
              }

/* -------------  data sections in quotation form  ------------- */
.panel {
             color: black;
             background-color: #fafafa;
             border-color: #C8C8C8;
             font-family: Arial, Tahoma, Geneva;                /* font for text */
              } 


/* -------------  Buttons  ------------- */
body #content button.trq-dropdownButton {
              border-radius: 0;
              padding: .25em .5em .35em;
              color: black;
              background: #00677F;
             border-color: #E6E6E6;
             font-family: Arial, Tahoma, Geneva;               /* font for text */
              }


/* -------------  8 Icon/Glyphicon color Not At The footer eg. 'edit asset'  ------------- */
.trq-btn i:before, .trq-btn span:first-child:before, .trq-icon-btn i:before, .trq-icon-btn span:first-child:before {
              color: black;
              font-size: 14px;
              position: relative;
              top: .15em;
              padding: 0;
              }


/* -------------  The Header For Tables On The Page E.G Payment Structure  ------------- */
#content div table th {
             background-color:  #E6E6E6;
             font-family:Arial, Tahoma, Geneva;               /* font for text */
              }


/* -------------  Total Payment color  ------------- */
.content-bar .prominent-footer-label li > div > span {
              display: flex;
              align-items: center;
              font-size: 24px;
              color: #00677F;
              background-color: #E6E6E6;
             font-family: Arial, Tahoma, Geneva;                            /* font for text */
                           }


/* --------------- color for Glyphicons Footer (and writing) --------------- */
.glyphicons {
    color: #000000;
              }


/* --------------- Background and Text Glyphicon Buttons --------------- */
#content section.toolbar div.container-fluid nav.tools ul>li>button.trq-btn {
              color: #black;
              background-color: #E6E6E6;
              display: flex;
              }

/* ------ hover background color or Glyphicons at the bottom ------- */
#content nav.tools ul > li > a:hover, #content .ui-panel nav.tools ul > li > a:hover, #content nav.tools ul > li > span:hover, #content .ui-panel nav.tools ul > li > span:hover, #content nav.tools ul > li button:hover, #content .ui-panel nav.tools ul > li button:hover {
              /*color: #00677F;*/
              background-color: #E6E6E6;
              }

/* --------------- Hover color Glyphicons --------------- */
.toolbar ul li .trq-btn.btn.btn-default:hover .glyphicons {
              background: none;
              color: #00677F;
              }


/* --------------- The Most 2 Bottom Footers color --------------- */
.footer-controls, .content-bar {
              background-color: #C8C8C8;
              border-color: #C8C8C8;
font-family:Arial, Tahoma, Geneva;   
              }


/* --------------- Nothing Now --------------- */
.footer-controls:hover {
              background-color: #C8C8C8;
              }


/* --------------- Most 2 Bottome Footer background color --------------- */
#content .footer-controls div,
#content .content-bar div {
              background-color:  #C8C8C8;
              font-family: Arial, Tahoma, Geneva;   
              }

/* --------------- The Most Bottom Footer Colour --------------- */
footer.fixed section.footer{
              background-color: #444444;
              font-family:Arial, Tahoma, Geneva;   
              }

/* --------------- Background Colour --------------- */
body {
              background-color: #E6E6E6;
              }

/* --------------- Address field background --------------- */
#content .react-autosuggest__container > textarea, #content .react-autosuggest__container > input {
    background-color: white;
}